<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    {% load static %}
    <script src="{% static 'jQuery-3.5.1.js' %}"></script>
    <link rel="stylesheet" href="{% static 'bootstrap-3.4.1-dist/css/bootstrap.min.css' %}">
    <script src="{% static 'bootstrap-3.4.1-dist/js/bootstrap.min.js' %}"></script>
    <script src="/static/js/csrf.js"></script>

   {% block css %}


   {% endblock %}

</head>
<body>
{#导航条开始#}

<nav class="navbar navbar-default">
    <div class="container-fluid">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                    data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            {% block person_manage %}
                <a class="navbar-brand" href="#">个人管理</a>
            {% endblock %}

        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li><a href="/app01/site/{{ request.user.username }}?url={{ request.get_full_path }}">我的站点</a></li>

            </ul>
             <form class="navbar-form navbar-left" method="post" action="{% url 'app01_search' %}" >
                {% csrf_token %}
                <div class="form-group">
                    <input type="text"  class="form-control" placeholder="右边选择搜索对象" id="serach_cont_id" name="content">
                </div>
                <select name="choice" id="select_id" class="form-control">
                    <option value="11"> 资源</option>
                    <option value="10">班级</option>
                    <option value="100">用户</option>
                    <option value="200">帖子</option>
                    <option value="300">文件</option>
                </select>
                <input hidden value="{{ request.get_full_path_info }}" name="url">

                <input type="submit" value="提交" class="form-control">
            </form>
            <ul class="nav navbar-nav navbar-right">
                <li><a href="/app01/web_home/">返回首页</a></li>
                <li><a href="#">用户名：{{ request.user.username }}</a></li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                       aria-expanded="false"> 更多操作 <span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li id="MyClass"></li>
                        <li><a href="/app01/my_focu?url={{ request.get_full_path_info }}" >我的关注</a></li>
                        <li><a href="#" data-toggle="modal" data-target="#myModel">修改密码</a></li>
                        {% block change_avatar %}
                         <li><a href="/app01/change_avatar?url={{ request.get_full_path_info }}">更换头像</a></li>
                        {% endblock %}
                        <li><a href="{% url 'app01_sou_colle' %}">资源收藏</a></li>
                        <li><a href="{% url 'app01_fi_cellation' %}">笔记收藏</a></li>
                        <li><a href="{% url 'app01_ar_cellation' %}">帖子收藏</a></li>

                        <li role="separator" class="divider"></li>
                        <li><a href="{% url 'app01_logout' %}">退出登录</a></li>
                    </ul>
                </li>
            </ul>
        </div><!-- /.navbar-collapse -->
    </div><!-- /.container-fluid -->
</nav>
{#修改密码模态框开始#}
<!--模态框生效的关键： data-toggle="modal" data-target=".bs-example-modal-lg" id ='Mymodel' -->
<div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel"
     id="myModel">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
            <div class="container">
                <div class="row">
                    <div class="col-md-6 col-md-offset-2">
                        <h2 class="text-center">修改密码</h2>
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-6 col-md-offset-2">
                        <div class="form-group">
                            <label for="set_user">用户名</label>
                            <input type="text" disabled id="set_user"
                                   value="{{ request.user.username }}" class="form-control">

                        </div>
                        <div class="form-group">
                            <label for="id_old_pwd">原密码</label>
                            <input type="password" id="id_old_pwd" class="form-control">


                        </div>
                        <div class="form-group">
                            <label for="id_new_pwd">新密码</label>
                            <input type="password" id="id_new_pwd" class="form-control">

                        </div>
                        <div class="form-group">
                            <label for="id_confirm_pwd">确认密码</label>
                            <input type="password" id="id_confirm_pwd" class="form-control">

                        </div>
                        <p><span style="color: red" id="error"></span></p>
                        <button class="btn btn-success btn-sm" id="id_editer">确定修改</button>
                        <a type="button" class="btn btn-primary btn-sm"
                                data-dismiss="modal" href="{{ url }}">取消修改
                        </a>
                        <br>
                        <br>


                    </div>

                </div>
            </div>
        </div>
    </div>
</div>
{#修改密码模态框结束#}
{#导航条结束#}

<div class="container-fluid">
    <div class="row">
        {#左边布局开始#}
        <div class="col-md-2">
            <div class="list-group" id="id_for_p">
                <a href="#" class="list-group-item disable" style="background-color: rgba(47,89,95,0.51)">
                    用户相关操作
                </a>
                <a href="{% url 'app01_add_article' %}" class="list-group-item">发布帖子</a>
                <a href="#" class="list-group-item" data-toggle="modal" data-target="#Mymodal">上传笔记</a>

                {% block message %}
                 <a href="{% url 'app01_message' %}" class="list-group-item" >未读私信({{ count }})</a>
                {% endblock %}

                <span id="p_for_a"> </span>
                <span id="p_for_a2"> </span>
            </div>
         <div class="list-group">
              <a href="#" class="list-group-item disable" style="background-color: rgba(85,108,43,0.51)">
                    资源相关操作
                </a>
             <a href="{% url 'app01_web_sourse' %}" class="list-group-item" id="web_sourse_id">创建资源分类</a>
                <a href="{% url 'app01_up_web_source' %}" class="list-group-item" id="up_web_id">上传web资源</a>
                <a href="{% url 'app01_show_web' %}" class="list-group-item" > 我的web资源</a>
         </div>

        </div>

        <!--文件上传的模态框开始-->
        <div class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" id="Mymodal">
            <div class="modal-dialog modal-lg" role="document">
                <div class="modal-content">
                    <div class="panel panel-primary">
                        <div class="panel-heading">笔记上传</div>
                        <div class="panel-body">
                            <div class="container-fluid">
                                <div class="row">
                                    <div class="col-md-6 col-md-offset-3">
                                        <div class="form-group">
                                            <p style="color: #1b6d85" id="p1"><input type="file" id="up_file_id"
                                                                                     class="form-control"></p>
                                            <span style="color: red"></span>

                                        </div>
                                        <div class="form-group">
                                            <p style="color: #1b6d85" id="p2">笔记名:<input type="text" id="file_name_id"
                                                                                         class="form-control"></p>
                                            <span style="color: red"></span>
                                        </div>
                                        <div class="form-group">
                                            <p id="p3" style="color: #1b6d85">笔记描述: <input type="text" id="file_desc_id"
                                                                                           class="form-control"></p>
                                            <span style="color: red"></span>
                                        </div>
                                        <div class="form-group">
                                            <p style="color: #1b6d85">笔记是否共享:</p>
                                            <p style="color: #1b6d85"> 是 <input type="radio" name="share" value="1"
                                                                                class="c_radio" checked>&nbsp;&nbsp;

                                                否 <input type="radio" name="share" class="c_radio" value="0"></p>
                                        </div>
                                        <div class="form-group">
                                            <button type="button" class="bnt btn-block btn-primary" id="up_btn_id">提交
                                            </button>
                                            <button type="button" class="btn btn-danger btn-block" data-dismiss="modal">
                                                取消
                                            </button>

                                        </div>

                                    </div>
                                </div>
                            </div>


                        </div>
                    </div>

                </div>
            </div>
        </div>

        <!--文件上传的模态框结束-->


        {#左边布局结束#}
        {#右边布局开始#}
        <div class="col-md-8">

            <div>

                <!-- Nav tabs -->
                <ul class="nav nav-tabs" role="tablist">
                    {% block all_li %}

                        <li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab"
                                                                  data-toggle="tab">我的帖子</a></li>
                        <li role="presentation"><a href="#files" aria-controls="files" role="tab"
                                                   data-toggle="tab">我的笔记</a>
                        </li>

                        <li role="presentation"><a href="#profile" aria-controls="profile" role="tab"
                                                   data-toggle="tab">帖子分类</a>
                        </li>
                        <li role="presentation"><a href="#messages" aria-controls="messages" role="tab"
                                                   data-toggle="tab">帖子标签</a>
                        </li>
                        <li role="presentation"><a href="#settings" aria-controls="settings" role="tab"
                                                   data-toggle="tab">我的个人信息</a>
                        </li>

                    {% endblock %}


                </ul>

                <!-- Tab panes -->
                <div class="tab-content">
                    {% block all_content %}



                        <div role="tabpanel" class="tab-pane active" id="home">
                            {% block article %}
                                文章显示页面
                            {% endblock %}
                        </div>
                        <div role="tabpanel" class="tab-pane" id="profile">
                            {% block suibi %}
                                随笔显示页面
                            {% endblock %}
                        </div>
                        <div role="tabpanel" class="tab-pane" id="messages">
                            {% block caogao %}
                                草稿显示页面

                            {% endblock %}
                        </div>
                        <div role="tabpanel" class="tab-pane" id="files">
                            {% block files %}
                                文件显示页面
                            {% endblock %}
                        </div>
                        <div role="tabpanel" class="tab-pane" id="settings">
                            {% block settings %}
                                修改个人信息的页面

                            {% endblock %}

                        </div>
                    {% endblock %}
                </div>

            </div>

        </div>
        {#右边布局结束#}
        <div class="col-md-1">
            <p><img src="/media/{{ request.user.avatar }}" alt="图片加载" class="img-circle" height="100px"></p>

            <p>
                用户 <span class="glyphicon glyphicon-user"></span>
                <br><a>{{ request.user.username }}</a></p>
            <p id="p_phone">
                phone <span class="glyphicon glyphicon-phone"></span>
                <br><a href="#" id="phone_id">{{ request.user.phone }}</a>
            </p>
            <p>邮箱 <a href="#" id="email_id">{{request.user.email }}</a></p>
            <p id="p_title">
                站点签名 <span class="glyphicon glyphicon-pencil"></span>
                <br><a href="#" id="site_title_id">{{ request.user.blog.site_title }}</a>
            </p>
             <p id="role_for">角色</p>
        </div>

    </div>
</div>



{% block js %}
    <script>
    if('{{ request.username }}'.slice(0,3)==='312'){
        $('#MyClass').html("<a href='/app01/myclass/'> 我的班级 </a>")
    }

        $("#up_btn_id").click(function () {

            let formObj = new FormData()
            formObj.append('file', $('#up_file_id')[0].files[0])
            formObj.append('filename', $('#file_name_id').val())
            formObj.append('desc', $('#file_desc_id').val())
            formObj.append('share', $('.radio_c').hasClass('checked').val())
            $.ajax({
                url: "/app01/upload_file/",
                type: 'post',
                data: formObj,
                contentType: false,
                processData: false,
                success: function (array) {
                    alert(array)

                }
            })
        })
    </script>

{% endblock %}


</body>
</html>